<!-- 任务执行情况 -->
<template>
  <el-dialog title="新增我的授出" :visible.sync="dialogTableVisible" @close="$emit('update:visible',false)"
             :close-on-click-modal="false" width="70%">
    <el-row class="warp">
      <el-col :span="24" class="warp-main">
        <el-form ref="infoForm" :model="infoForm" label-width="120px">
          <el-form-item label="接受人:" v-if="addData.userOption">
            <span>{{ addData.userOption.user_name }}</span>
          </el-form-item>
          <el-form-item label="日程日期:">
            <el-select v-model="dayOption" placeholder="日期" v-if="!addData">
              <el-option :label="item" :value="item" v-for="(item, index) in dayList"
                         :key="index"></el-option>
            </el-select>
            <span v-else>{{ addData.day }} {{ addData.dayName }}</span>
          </el-form-item>
          <el-form-item label="日程时段:">
            <el-select v-model="timeOption" placeholder="时间段" v-if="!addData">
              <el-option :label="item.stringOption" :value="item.id" v-for="(item, index) in timeList"
                         :key="index"></el-option>
            </el-select>
            <span v-else>{{ addData.time.start_time }}-{{ addData.time.end_time }}</span>
          </el-form-item>
          <el-row>
            <el-col :span="16">
              <el-form-item label="日程内容:">
                <el-input v-model="infoForm.title" placeholder="日程内容" type="textarea"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8"></el-col>
          </el-row>
          <el-row>
            <el-col :span="16">
              <el-form-item label="友情提醒:">
                <el-input v-model="infoForm.remind" placeholder="日程内容"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="8"></el-col>
          </el-row>
        </el-form>
      </el-col>
    </el-row>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogTableVisible=false" size="small">取 消</el-button>
      <el-button type="primary" @click="onSubmit" size="small">确 定</el-button>
    </div>
  </el-dialog>
</template>
<script>
import {pagination, tableoption} from '@/utils/util.js'
import api from '@/utils/api.js'

export default {
  name: 'history',
  props: ['visible', 'optionData'],
  watch: {
    visible () {
      this.dialogTableVisible = this.visible
      if (this.visible) {
        console.log('数据内容：', this.optionData)
        if (this.optionData) {
          this.addData = JSON.parse(this.optionData)
          this.infoForm.hour_id = this.addData.time.id
          this.infoForm.time = this.addData.day
        } else {
          this.getDayListFn()
        }
      } else {
        this.infoForm.title = ''
        this.infoForm.hour_id = ''
        this.infoForm.time = ''
        this.infoForm.remind = ''
      }
    }
  },
  data () {
    return {
      infoForm: {
        title: '', // 标题
        hour_id: '',
        time: '', //
        remind: ''
      },
      dialogTableVisible: this.visible,
      dayOption: '',
      timeOption: '',
      dayList: [],
      timeList: [],
      addData: ''
    }
  },
  created () {

  },

  methods: {
    getDayListFn () {
      // 日期
      this.$fetch(this.api.schedule.scheduleTime, {}).then((response) => {
        if (response.code === 0) {
          this.dayList = response.list
        } else {
        }
      }).catch((err) => {
        console.log(err)
      })
      // 时间段
      this.$fetch(this.api.schedule.scheduleHour, {status: 1}).then((response) => {
        if (response.code === 0) {
          for (let i in response.list) {
            response.list[i].stringOption = response.list[i].start_time + '-' + response.list[i].end_time
          }
          this.timeList = response.list
        } else {
        }
      }).catch((err) => {
        console.log(err)
      })
    },
    onSubmit () {
      console.log('数据提交', this.infoForm)
      if (!this.infoForm.time) {
        this.$message({
          message: '请选择日程日期',
          type: 'error'
        })
        return
      }
      if (!this.infoForm.hour_id) {
        this.$message({
          message: '请选择日程时间段',
          type: 'error'
        })
        return
      }
      if (!this.infoForm.title) {
        this.$message({
          message: '请选择日程内容',
          type: 'error'
        })
        return
      }
      // addData.userOption 存在的是授出人
      let urlOption = this.api.schedule.myschedule // 添加自己的
      let dataFrom = {}
      if (this.addData.userOption) {
        urlOption = this.api.schedule.scheduleInviter // 添加别人的
        // infoForm: {
        //   title: '', // 标题
        //       hour_id: '',
        //       time: '', //
        //       remind: ''
        // },
        // infoForm: {
        //   title: '', // 标题
        //       list: [], //
        //       user_ids: '',
        //       remind:''
        // },
        // {"day":"2020-11-13","time":{"id":11,"start_time":"11:00","end_time":"12:00","list":[]},"dayName":"星期五","userOption":{"user_id":3,"user_name":"熊秋瑾"}}
        dataFrom.list = JSON.stringify([{time: this.addData.day, hour_id: this.addData.time.id}])
        dataFrom.user_ids = this.addData.userOption.user_id
        dataFrom.title = this.infoForm.title
        dataFrom.remind = this.infoForm.remind
      } else {
        dataFrom = this.infoForm
      }
      this.$post(urlOption, dataFrom).then(res => {
        if (res.code === 0) {
          this.$message({
            message: res.msg,
            type: 'success'
          })
          this.dialogTableVisible = false
          this.$emit('checkInit')
        } else {
          this.$message({
            message: res.msg,
            type: 'error'
          })
        }
      })
    }
  }
}
</script>
